<template>
	<view class="message">
		<view class="message-plate-1" v-if="is_token == true">
			<navigator url="sysMessage/sysMessage" open-type="navigate">
				<view class="item">
					<image src="../../static/ic_message_sys.png" mode="widthFix"></image>
					<text>系统消息</text>
					<view class="yuan" v-if="messageData.sys_message > 0">
						{{messageData.sys_message}}
					</view>
				</view>
			</navigator>
			<navigator url="orderMessage/orderMessage" open-type="navigate">
				<view class="item">
					<image src="../../static/ic_message_order.png" mode="widthFix"></image>
					<text>订单消息</text>
					<view class="yuan" v-if="messageData.order_item > 0">
						{{messageData.order_item}}
					</view>
				</view>
			</navigator>
			<navigator url="appraisalMessage/appraisalMessage">
				<view class="item">
					<image src="../../static/ic_message_identify.png" mode="widthFix"></image>
					<text>鉴定消息</text>
					<view class="yuan" v-if="messageData.authentication > 0">
						{{messageData.authentication}}
					</view>
				</view>
			</navigator>
		</view>
		<view class="message-plate-1" v-else @click="goLogin">
				<view class="item">
					<image src="../../static/ic_message_sys.png" mode="widthFix"></image>
					<text>系统消息</text>
					<view class="yuan" v-if="messageData.sys_message > 0">
						{{messageData.sys_message}}
					</view>
				</view>
				<view class="item">
					<image src="../../static/ic_message_order.png" mode="widthFix"></image>
					<text>订单消息</text>
					<view class="yuan" v-if="messageData.order_item > 0">
						{{messageData.order_item}}
					</view>
				</view>
				<view class="item">
					<image src="../../static/ic_message_identify.png" mode="widthFix"></image>
					<text>鉴定消息</text>
					<view class="yuan" v-if="messageData.authentication > 0">
						{{messageData.authentication}}
					</view>
				</view>
		</view>
		<view class="message-plate-2">
			<view class="item" v-for="(item,index) in msgList" :key="index" @click="goIM(item.userProfile.userID,item.unreadCount)">
				<view class="left">
					<image :src="item.userProfile.avatar" mode=""></image>
					<view class="user-info">
						<text>{{item.userProfile.nick}}</text>
						<text v-if="item.lastMessage.type == 'TIMTextElem'">{{item.lastMessage.payload.text}}</text>
					</view>
				</view>
				<view class="right">
					{{formatDate(item.lastMessage.lastTime)}}
				</view>
				<view class="tag-num" v-if="item.unreadCount !== 0">
					{{item.unreadCount}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import IM from '../../static/js/IM.js'
	export default {
		data() {
			return {
				messageData:'',
				msgList:[],
				is_token:false
			}
		},
		created() {
		},
		onShow() {
			this.getMessageNum()
			this.getConversationList()
			IM.onMessage()
			IM.onTab()
			let go_login = uni.getStorageSync('go_login')
			if (go_login == 1) {
				this.is_token = false
			} else{
				this.is_token = true
			}
		},
		methods: {
			// 去登陆
			goLogin(){
				uni.showModal({
					content:'宝贝都为珍惜孤品，为了保障您的购买体验和资金安全，系统需要您的授权，所有的信息都会保密',
					confirmText:'去授权',
					confirmColor:'#D1AA56',
					success: (res) => {
						if (res.confirm) {
							uni.switchTab({
								url:'../mine/mine'
							})
						}
					}
				})
			},
			// 前往IM
			goIM(id,num){
				uni.navigateTo({
					url:'../common/IM/IM?id=' + id + '&num=' + num
				})
			},
			// 转化时间戳
			formatDate(value) {
				let time = new Date(value * 1000)
				let year = time.getFullYear()
				let month = time.getMonth() + 1
				let date = time.getDate()
				let hours = time.getHours()
				let minute = time.getMinutes()
				let second = time.getSeconds()
				if (month < 10) {
					month = '0' + month
				}
				if (date < 10) {
					date = '0' + date
				}
				if (hours < 10) {
					hours = '0' + hours
				}
				if (minute < 10) {
					minute = '0' + minute
				}
				if (second < 10) {
					second = '0' + second
				}
				return year + '-' + month + '-' + date + ' ' + hours + ':' + minute + ':' + second
			},
			// 请求会话列表
			getConversationList(){
				// 拉取会话列表
				let promise = this.$tim.getConversationList();
				promise.then((imResponse)=> {
				  const conversationList = imResponse.data.conversationList; // 会话列表，用该列表覆盖原有的会话列表
				  console.log(conversationList)
				  let arr = []
				  for (var i = 0; i < conversationList.length; i++) {
					  if(conversationList[i].type == "C2C"){
						 arr.push(conversationList[i]) 
					  }
				  }
				  this.msgList = arr
				}).catch((imError)=> {
				  console.warn('getConversationList error:', imError); // 获取会话列表失败的相关信息
				});
			},
			// 请求消息数量
			getMessageNum(){
				uni.request({
				    url:this.$Url +'/index.php/app/users/messageManage',
				    method:'POST',
				    data:{
				       
				    },
				    header:{
				        "token":uni.getStorageSync('token')
				    },
				    success: (res) => {
						if (res.data.status == 200) {
							this.messageData = res.data.data
						} else{
							// uni.showToast({
							// 	title:res.data.msg,
							// 	icon:'none',
							// 	duration:1200
							// })
						}
				    }
				})
			}
		}
	}
</script>

<style scoped lang="scss">
.message{
	width: 100vw;
	min-height: 100vh;
	background-color: #f8f8f8;
	.message-plate-1{
		padding: 0 66upx;
		height: 300upx;
		background-color: #fff;
		display: flex;
		align-items: center;
		justify-content: space-between;
		.item{
			display: flex;
			align-items: center;
			flex-direction: column;
			justify-content: center;
			position: relative;
			.yuan{
				position: absolute;
				top: 0;
				right: 0;
				width: 40upx;
				height: 40upx;
				border-radius: 50%;
				background-color: red;
				color: #fff;
				font-size: 22upx;
				display: flex;
				align-items: center;
				justify-content: center;
			}
			image{
				width: 115upx;
				height: 115upx;
				margin-bottom: 15upx;
			}
			text{
				font-size: 30upx;
				color: #333;
			}
		}
	}
	.message-plate-2{
		margin-top: 20upx;
		background-color: #fff;
		padding: 0 23upx;
		.item{
			display: flex;
			align-items: center;
			justify-content: space-between;
			height: 110upx;
			border-bottom: 1upx solid #eee;
			position: relative;
			.tag-num{
				position: absolute;
				top: 15rpx;
				left: 40rpx;
				background-color: red;
				border-radius: 50%;
				color: #fff;
				font-size: 22rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				width: 36rpx;
				height: 36rpx;
			}
			.left{
				display: flex;
				align-items: center;
				justify-content: center;
				image{
					width: 70upx;
					height: 70upx;
					border-radius: 50%;
					margin-right: 15upx;
				}
				.user-info{
					display: flex;
					flex-direction: column;
					text:first-child{
						font-size: 24upx;
						color: #333;
						margin-bottom: 15upx;
					}
					text:last-child{
						font-size: 22upx;
						color: #666;
					}
				}
			}
			.right{
				font-size: 22upx;
				color: #999;
				height: 70upx;
			}
		}
	}
}
</style>
